<template>
  <div class="serviceTable">
    <div class="title">
      <h3>服务统计</h3>
    </div>
    <div class="share-table">
      <el-form :model="form">
        <div class="ele-div-keysearch">
          <div class="search-left" />
          <div class="search-right search-flex">
            <div class="ele-input">
              <el-input v-model="form.keywords" suffix-icon="el-icon-search" placeholder="输入手机号/订单号搜索" />
            </div>
            <el-button type="primary">确认</el-button>
          </div>
        </div>
      </el-form>
      <div class="ele-table">
        <el-table :data="BindData" stripe>
          <el-table-column label="订单号" prop="orderCode" />
          <el-table-column label="用户" prop="user" />
          <el-table-column label="预约服务" prop="appointService" />
          <el-table-column label="预约时间" prop="appointTime" />
          <el-table-column label="金额" prop="amount" />
          <el-table-column label="状态" prop="state" />
          <el-table-column label="操作">
            <template slot-scope="scope">
              <el-button
                type="text"
                plain
                @click="viewDetails(scope.row)"
              >查看详情</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
  </div>
</template>

<script>/** 商户分成金额收益统计 */
import { serviceCountList } from '@/api/service'

export default {
  name: 'ServiceTable',
  data() {
    return {
      doctorid: '',
      form: {
        keywords: ''
      },
      BindData: [
        /* {
          orderCode: '2021072312545',
          user: '哈哈哈',
          appointService: '制氧机咨询',
          appointTime: '07-04 12:00-14:00',
          amount: '19.9元',
          state: '待服务'
        },
        {
          orderCode: '2021072312545',
          user: '哈哈哈',
          appointService: '理疗仪咨询',
          appointTime: '07-04 12:00-14:00',
          amount: '19.9元',
          state: '待服务'
        },
        {
          orderCode: '2021072312545',
          user: '哈哈哈',
          appointService: '制氧机咨询',
          appointTime: '07-04 12:00-14:00',
          amount: '19.9元',
          state: '已完成'
        }*/
      ]
    }
  },
  created() {
    this.init()
  },
  methods: {
    init() {
      this.doctorid = this.$route.query.doctorid
      const data = {
        doctorId: this.doctorid,
        keywords: ''
      }
      serviceCountList(data).then(response => {
        console.log(response.data.data)
        this.BindData = response.data.data.data
      })
    },
    getList() {
      const data = {
        doctorId: this.doctorid,
        keywords: this.keywords
      }
      serviceCountList(data).then(response => {
        console.log(response.data.data)
        this.BindData = response.data.data.data
      })
    },
    /** 查看详情*/
    viewDetails(row) {
      this.$router.push({ name: 'shareDetail', query: row })
    }
  }
}
</script>

<style lang="scss" scoped>
.serviceTable {
  width: 100%;
  padding: 0px 50px;
  .el-div-info {
    margin: 20px 0px;
    height: 200px;

    .info-box {
      height: 150px;
      padding: 10px 20px;
      border-radius: 10px;
      margin-top: 20px;
      color: #FFFFFF;

      .space {
        margin: 20px 0px;
      }

      .button-space {
        margin-top: 10px;
      }
    }
  }
  .ele-div-keysearch {
    display: flex;
    justify-content: space-between;
    .search-flex {
      display: flex;
      ::v-deep.el-button {
        margin-left: 15px;
      }
    }
  }
  .ele-table {
    width: 100%;
    margin-top: 40px;
  }

}
</style>
